@import "../../../../../../../styles/mixins";
.company-wrapper{
  width: 100%;
  height: auto;
  .button-wrapper{
    width: 100%;
    height: 2rem;
    margin: 1rem 0;
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    .sem-button {
      height: 1.875rem;
      line-height: 1.6rem;
      width: 3.125rem;
      margin-top: auto;
      margin-bottom: auto;
      margin-right: 1.25rem;
      border-radius:100px;
      background-color: white;
      border:1px solid #cccccc;
    }
    .add-name{
      height: 2rem;
      line-height: 2rem;
      font-size: .875rem;
      margin-left: .625rem;
    }
    .save-btn{
      height: 1.875rem;
      line-height: 1.875rem;
      width: 6.25rem;
      border-radius:100px;
      background:linear-gradient(90deg, #fa6396 0%, #f66a21 100%);
      border:none;
      font-size:.875rem;
      margin: auto 1rem auto auto;
    }
  }
  .body-top{
    width: 100%;
    height: 10.625rem;
    border:1px solid #f1f4f5;
    border-radius:5px;
    display: flex;
    justify-content: space-around;
    flex-direction: row;
    margin-bottom: .5625rem;

    .body-top-middle{
      width: 22.5rem;
      height: 8.125rem;
      margin: auto;
    }
    .body-top-end{
      width: 22.5rem;
      height: 8.125rem;
      margin: auto;
    }
    .option-wrapper{
      height: auto;
      width: 100%;
      display: flex;
      justify-content: flex-start;
      flex-direction: row;
      margin-bottom: .875rem;
      .option-title{
        width: 4.625rem;
        height: 2.125rem;
        line-height: 2.125rem;
        text-align: center;
        margin-right: .1875rem;
        background:#f1f4f5;
        border:1px solid #e3e8eb;
        border-radius:3px;
      }
      .option-input{
        width: 17.5rem;
        height: 2.125rem;
        background:#ffffff;
        border:1px solid #e4e9eb;
        border-radius:3px;
      }

      .ant-select-selection{
        background:#ffffff;
        border:1px solid #e4e9eb;
        border-radius:3px;
        color:#999999;
      }
      .ant-select-selection--single {
        width: 8.625rem;
        height: 2.125rem;
        .ant-select-selection__rendered {
          line-height: 2.125rem;
        }
      }
      .big{
        .ant-select-selection--single {
          width: 17.5rem;
        }
      }
      .select-margin{
        margin-right: .1875rem;
      }
    }
  }

  .body-middle{
    width: 100%;
    height: 23.125rem;
    border:1px solid #f1f4f5;
    border-radius:5px;
    padding: 0 1.5625rem;
    margin-bottom: .875rem;
    .company-intro{
      height: 6.875rem;
      width: 100%;
      background:#ffffff;
      border:1px solid #e4e9eb;
      resize: none;
      font-size:.875rem;
      color:#333333;
    }
    .sights-wrapper{
      height:9.35rem ;
      width: 100%;
      display: flex;
      flex-direction: row;
      justify-content: flex-start;
      .image-drop-zone{
        margin: 0 0 0 .625rem;
      }
      &>ul{
        list-style:none;
        overflow-x: auto;
        overflow-y: hidden;
        margin:0;
        padding:0;
        zoom:1;
        white-space: nowrap;
        max-width: 60rem;
        height:100%;
        &>li{
          margin-right: .625rem;
          display: inline-block;
          .sights-check-box{
            position: absolute;
            height: 1.2rem;
            width: 1.2rem;
            margin-top: 0.3125rem;
            margin-left: .3125rem;
          }
        }
        &>li>img{
          width: 9.75rem;
          height: 8.125rem;
        }
      }
    }
  }
  .body-end{
    width: 100%;
    height: 34.625rem;
    border:1px solid #f1f4f5;
    border-radius:5px;
    padding: 0 1.5625rem;
    position: relative;
  }
  @include title-wrapper;
  @include drop-zone;

  .ant-checkbox-inner{
    border: 1px solid #d9d9d9;
  }
  .ant-checkbox-checked .ant-checkbox-inner, .ant-checkbox-indeterminate .ant-checkbox-inner{
    background-color: #ff595f;
  }
  .ant-checkbox-checked:after{
    background-color: #ff595f;
  }
  .ant-checkbox-checked:after{
    border: 1px solid #ff595f;
  }
  .hover-wrapper{
    display: flex;
    flex-direction: column;
    justify-content: center;
    .sem-button{
      border: none;
      background: #ff595f;
      margin: auto;
    }
  }

  .add-top-div{
    height: 4.75rem;
    width: 100%;
    display: flex;
    justify-content: flex-start;
    flex-direction: row;
    margin-bottom: .875rem;
    border:1px solid #f1f4f5;
    border-radius:5px;
    .option-wrapper{
      height: auto;
      width: 100%;
      display: flex;
      justify-content: flex-start;
      flex-direction: row;
      .option-title{
        width: 4.625rem;
        height: 2.125rem;
        line-height: 2.125rem;
        text-align: center;
        margin: auto .1875rem auto 1.5625rem;
        background:#f1f4f5;
        border:1px solid #e3e8eb;
        border-radius:3px;
      }
      .option-input{
        width: 17.5rem;
        height: 2.125rem;
        background:#ffffff;
        border:1px solid #e4e9eb;
        border-radius:3px;
        margin: auto 0 auto 0;
      }
      .add-tool-div{
        width: 7.8125rem;
        margin: auto 3.3125rem auto auto;
        .ant-divider{
          font-size: .875rem;
          color:#333333;
        }
      }
    }
  }

  .add-middle-div{
    width: 100%;
    height: 11.125rem;
    border:1px solid #f1f4f5;
    border-radius:5px;
    padding: 0 1.5625rem;
    margin-bottom: .875rem;
    .work-intro{
      height: 6.875rem;
      width: 100%;
      background:#ffffff;
      border:1px solid #e4e9eb;
      resize: none;
      font-size:.875rem;
      color:#333333;
    }
  }
  .add-end-div{
    width: 100%;
    height: auto;
    border:1px solid #f1f4f5;
    border-radius:5px;
    padding: 0 1.5625rem 1.5625rem 1.5625rem;
  }

  form .ant-cascader-picker, form .ant-select{
    width: auto;
  }
  .ant-form-item{
    margin-bottom: 0;
  }
  .title-btn-save{
    position: absolute;
    right: 4rem;
  }
}


